<template>
    <div class="headerCon">
        <div class="row items-center">
            <div class="col-auto text-left backBox">
                <q-icon name="fa-solid fa-arrow-left" class="iconBack" @click="back()"/>
            </div>
            <div class="col text-center hderBox">
                <span class="titleText">忘记密码</span>
            </div>
        </div>
    </div>

    <div class="forgotPwCon">
        <div>
            <span class="fpTitle">员工工号</span> <br/>
        </div>
    </div>

</template>

<script setup>
import { useRouter } from 'vue-router'

const $router = useRouter()

const back = () => {
  $router.back()
}
</script>

<style lang="scss" scoped>
    // @import 'src/css/auth.scss';
    .headerCon{
        margin-top: 15%;
        font-size: 1.5rem;
        .backBox{
            padding-bottom: 5px;
            .iconBack{
                font-size: 3rem;
                @media (max-width:480px){
                    font-size: 1.8rem;
                }
            }
        }
        .titleText{
            color: white;
            text-align: center;
            margin-right: 40px;
        }
    }

    .forgotPwCon{
        background-image: linear-gradient(#E0E0F6, #E4E5F8, #E9ECFA);
        width: 70%;
        margin-top: 10px;
        margin-left: auto;
        margin-right: auto;
        border-radius: 10px;
        padding: 10px;
        text-align: center;

        .fpTitle{
            font-weight: bold;
        }
    }
</style>
